<link rel="stylesheet" href="/assets/plugins/button_indicator/dist/ladda-themeless.min.css">
<script src="/assets/plugins/button_indicator/dist/spin.min.js"></script>
<script src="/assets/plugins/button_indicator/dist/ladda.min.js"></script>

<div class="row">
    <div class="col-md-12">
        <div class="box box-info">
            <div class="box-header">
                <i class="fa fa-table"></i>
                <h3 class="box-title">List Content</h3>
            </div><!-- /.box-header -->
            <div class="box-body">
            	<table id="listContentTable" class="table table-bordered table-striped display" cellspacing="0" width="100%">
			    	<thead>
						<?php
							echo "<tr>";
							foreach ($this->tableData['headers'] as $key => $header)
							{
								echo "<th class=\"th-col-$key\">$header</th>";
							}
							echo "</tr>";
						?>
					</thead>
					<tbody>
						<?php
							foreach ($this->tableData['rows'] as $key => $row)
							{
								$stt = $key + 100;
								$position = $key + 1;
								echo "<tr data-position=\"$position\" id=\"$stt\">";
								foreach ($row as $key => $col)
								{
									echo "<td class=\"col-$key\">$col</td>";
								}
								echo "</tr>";
							}
						?>
					</tbody>
			    </table>
            </div><!-- /.box-body -->
            <div class="box-footer">
            	<div class="btn-group" role="group" aria-label="...">
            		<a href="/admin/manage/addcontent?subcategory_id=<?php echo $this->subcategory_id; ?>" class="btn btn-primary">Add New</a>
	            	<button class="btn btn-info" onclick="importForm()">Import Videos</button>
	            	<!-- Split button -->
					<!-- <div class="btn-group">
						<button type="button" class="btn btn-default dropdown-toggle" data-toggle="dropdown" aria-expanded="false">
							Import <span class="caret"></span>
						</button>
						<ul class="dropdown-menu" role="menu">
							<li><a href="javascript: importForm()">Videos</a></li>
							<li><a id="importPhotoBtn" href="/admin/manage/importphotoform?subcategory_id=<?php echo $this->subcategory_id; ?>" >Pictures</a></li>
						</ul>
					</div> -->
        		</div>
            	<button id="submitOrderBtn" class="btn btn-success ladda-button pull-right" data-style="expand-right"><span class="ladda-label">Submit Order</span></button>
            </div>
        </div><!-- /.box -->
    </div><!-- /.col -->
</div>
<!-- <div class="buffer" style="display: block; width: 100%; height: 50px;"></div> -->
<div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
	<div class="modal-dialog">
		<div class="modal-content form-container">
			<div class="modal-header">
				<button type="button" class="close" data-dismiss="modal">
					<span aria-hidden="true">&times;</span><span class="sr-only">Close</span>
				</button>
				<h4 class="modal-title">Import Video</h4>
			</div>
			<div class="modal-body">
				<p id="form_alert" style="color: red; display: none;"></p>
	            <div class="box-body">
	                <div class="form-group">
	                    <label for="title">URL</label>
	                    <input type="text" class="form-control" id="playlist_url" placeholder="Enter URL of playlist, video, user page or channel page" >
	                </div>
	            </div>
			</div>
			<div class="modal-footer">
				<button type="button" class="btn btn-default" data-dismiss="modal">Cancel</button>
				<button type="button" onclick="importInit(<?php echo $this->subcategory_id; ?>);" class="btn btn-primary">Submit</button>
			</div>
		</div>
		
		<div class="modal-content progress-container" style="display: none;">
			<div class="modal-header">
				<!-- <button type="button" class="close" data-dismiss="modal">
					<span aria-hidden="true">&times;</span><span class="sr-only">Close</span>
				</button> -->
				<h4 class="modal-title">Importing...</h4>
			</div>
			<div class="modal-body" style="font-size: 1.1em;">
				<div class="progress">
					<div class="progress progress-striped active">
	                    <div class="progress-bar progress-bar-primary" role="progressbar" aria-valuenow="100" aria-valuemin="0" aria-valuemax="100" style="width: 100%">
	                        <span class="sr-only">0% Complete</span>
	                    </div>
	                </div>
				</div>
	            
            	<div class="row">
                	<div class="col-sm-6 result-label">Videos found:</div>
                	<div class="col-sm-6 total_count"></div>
                </div>
                <div class="row">
                	<div class="col-sm-6 result-label">Imported:</div>
                	<div class="col-sm-6 success_count"></div>
                </div>
                <div class="row">
                	<div class="col-sm-6 result-label">Conflict:</div>
                	<div class="col-sm-6 conflict_count"></div>
                </div>
                <div class="row">
                	<div class="col-sm-6 result-label">Error (Deleted or Private video):</div>
                	<div class="col-sm-6 error_count"></div>
                </div>
			</div>
			<div class="modal-footer" style="display: none;">
				<button type="button" class="btn btn-default" data-dismiss="modal" onclick="location.reload()" >Close</button>
			</div>
		</div>
		
	</div>
</div>
<script src="/assets/js/import_tool.js"></script>

<div class="modal fade" id="myModal2" tabindex="-1" role="dialog" aria-labelledby="myModal2Label" aria-hidden="true">
	<div class="modal-dialog">
		<div class="modal-content form-container">
			<div class="modal-header">
				<button type="button" class="close" data-dismiss="modal">
					<span aria-hidden="true">&times;</span><span class="sr-only">Close</span>
				</button>
				<h4 class="modal-title">Move Content</h4>
			</div>
			<div class="modal-body">
			</div>
			<div class="modal-footer">
				<button type="button" class="btn btn-default" data-dismiss="modal">Cancel</button>
				<button type="button" onclick="moveItem()" class="btn btn-primary">Submit</button>
			</div>
		</div>
	</div>
</div>
